<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="../css/index.css">

<style>
  .el-dialog__body{
    padding: 0 20px;
  }
	.i1{
		width:100px;
		height:100px;
		margin-left: 10px;
	}
	.pic{
	margin-left: 10px;
	width:75px;
	}
	.pic1{
    width: 300px;
    height: 100px;
    margin-bottom: 10px;
	}
	.picshow{
	float: left;
	}
	.pic2{
	float: left;
	}
	.e1{
	clear: both;
	}
  
	.ban{
	  background-color: #409EFF !important; /* Element UI 的蓝色 */  
  	border-color: #409EFF !important; /* 确保边框也是蓝色 */  
  	color: #FFFFFF !important; /* 文本颜色，根据需要调整 */
	}
  .select1{
    width: 100px;
    height: 40px;
    border: 1px solid #c4b8b8; /* 灰色边框 */  
  border-radius: 4px; /* 可选：添加圆角边框 */
  font-size: 16px;
  }
  .o1{
    width: 100px;
    height: 20px;
  }
  .adminprval{
      position: relative;
      right:85px;
      top:75px;
      color: #173bdf !important; /* 文本颜色，根据需要调整 */
      font-size: 15px;
    }
  .flex{
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
  }
  .center{
      display: flex;
      justify-content: center;
      align-items: center;
  }
  nav{
      display: flex;
      height: 100%;
  }
  nav .el-link{
      padding-inline: 20px;
      font-size: 1em;
  }
  nav .el-link:hover{
      background-color: #99f7;
  }
  img{
      width: 40px;
      height: 40px;
      object-fit: cover;
  }
  .hsc:hover{
      transform: scale(1.1);
      box-shadow: 3px 3px 3px 3px #8888;
  }
  .grid2,.grid3,.grid4{
      gap: 10px;
  }
  .grid2{
      display: grid;
      grid-template-columns: auto auto;
  }
  .grid3{
      display: grid;
      grid-template-columns: auto auto auto;
  }
  .grid4{
      display: grid;
      grid-template-columns: auto auto auto auto;
  }
  .h100{
      height: 100%;
  }
  small{
      font-size: .7em;
      color: #989
  }
  li{
      margin-block: 10px;
  }
  .fill{
      border: 0px;
      border-bottom: 1px #000 solid;
      margin-inline: 3px;
      padding: 5px;
      text-align: center;
      color: #0a6999;
  }
  .el-form-item{
      margin-block: 10px 0px;
      padding-inline: 10px;
  }
  .el-switch{
      align-self: center
  }
  .el-upload-list__item {
      transition: none !important;
  }


</style>

</head>
<body>

<div id="app">
    <el-card class="box-card">
        <el-form :inline="true" class="demo-form-inline">
        	<el-form-item label="题目编号">
                <el-input v-model="product.pid" placeholder="编号"></el-input>
              </el-form-item>
            
            <!-- 类别输入提示框 -->
              <el-form-item label="题目名称">
              <el-row class="demo-autocomplete">
			  <el-col>
			    <el-autocomplete
			      class="inline-input"
			      v-model="product.pname"
			      :fetch-suggestions="querySearch1"
			      placeholder="请输入内容"
			    ></el-autocomplete>
			  </el-col>
              </el-row>
              </el-form-item>
              
              <!-- 类别输入提示框 -->
              <el-form-item label="题目类别">
              <el-row class="demo-autocomplete">
			  <el-col>
			    <el-autocomplete
			      class="inline-input"
			      v-model="product.tname"
			      :fetch-suggestions="querySearch"
			      placeholder="请输入内容"
			    ></el-autocomplete>
			  </el-col>
              </el-row>
              </el-form-item>

            <el-form-item label="题目类型">
                <el-select v-model="product.types" placeholder="状态">
                    <el-option label="所有" value="-1"></el-option>
                    <el-option label="填空题" value="填空题"></el-option>
                    <el-option label="单选题" value="单选题"></el-option>
                    <el-option label="多选题" value="多选题"></el-option>
                    <el-option label="判断题" value="判断题"></el-option>
                </el-select>
            </el-form-item>

    		<el-form-item label="题目状态">
              <el-select v-model="product.status" placeholder="状态">
              	<el-option label="所有" value="-1"></el-option>
                <el-option label="下架" value="0"></el-option>
                <el-option label="上架" value="1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="bygoods(1)">查询</el-button>
            </el-form-item>
          </el-form>

        <!--表格显示-->
          <el-table
          :data="members.records"
          border
          style="width: 100%; margin-top: 40px; min-height: 290px">
          <el-table-column
          label="题目编号"
          align="center"
          >
          <template slot-scope="scope">
            <span>{{ scope.row.id }}</span>
          </template>
          </el-table-column>
          <el-table-column
          label="题目图片"
          align="center"
          >
          <template slot-scope="scope">
              <img v-if="scope.row.image != null && scope.row.image?.trim() !== ''" class="i1" :src="scope.row.image">
          </template>
          </el-table-column>
          <el-table-column
          label="题目类别"
          align="center"
          >
          <template slot-scope="scope">
            <span>{{ type.find(a=> a.id == scope.row.course)?.tname }}</span>
          </template>
          </el-table-column>

              <el-table-column
                      label="题目类型"
                      align="center"
              >
                  <template slot-scope="scope">
                      <span>{{ scope.row.type }}</span>
                  </template>
              </el-table-column>

              <el-table-column
                      label="创建时间"
                      align="center"
              >
                  <template slot-scope="scope">
                      <span>{{ formatTimestamp(scope.row.createTime) }}</span>
                  </template>
              </el-table-column>
          
          <el-table-column
          label="题目详情"
          align="center"
          >
          <template slot-scope="scope">
            <el-button
            size="mini"
            @click="open(scope.row)">查看</el-button>
          </template>
          </el-table-column>
          
          <el-table-column label="操作" align="center" width="160px">
          <template slot-scope="scope">
            <el-button
            size="mini"
            @click="update(scope.row)">编辑</el-button>
            <el-button v-if="scope.row.status == 1"
	          size="mini"
	          type="danger"
	          class="ban"
	          @click="banL(scope.$index, scope.row)">下架</el-button>
	          <el-button v-if="scope.row.status == 0"
	          size="mini"
	          type="danger"
	          @click="banL(scope.$index, scope.row)">上架</el-button>
          </template>
          </el-table-column>
        </el-table>

        <!--页码-->
        <br/>
        <div class="block">
          <span class="demonstration"></span>
          <el-pagination
            @size-change="handleSizeChange"
		      @current-change="handleCurrentChange"
		      :current-page="currentPage4"
		      :page-sizes="[10,20,30,40,50]"
		      :page-size="pagesize"
		      layout="total, sizes, prev, pager, next, jumper"
		      :total="total">
          </el-pagination>
        </div>
        
        <!--添加按钮-->
        <br/>
        <el-button type="success" plain @click="upquestion">添加题目</el-button>
    </el-card>

    <!--  新增题目-->
    <el-dialog title="题目信息" :visible.sync="showEditor">
        <el-form>
            <el-form-item label="题型" :label-width="'100'">
                <el-select placeholder="请选择题型" v-model="questionOne.type" @change="clean">
                    <el-option label="填空题" value="填空题"></el-option>
                    <el-option label="单选题" value="单选题"></el-option>
                    <el-option label="多选题" value="多选题"></el-option>
                    <el-option label="判断题" value="判断题"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="课程" :label-width="'100'">
                <el-select placeholder="请选择课程" v-model="questionOne.course">
                    <el-option v-for="t in type" :label="t.tname" :value="t.id"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="题目" :label-width="'100'">
                <el-input autocomplete="off" type="textarea" style="width: 90%" v-model="questionOne.content"></el-input>
            </el-form-item>

            <!--      图片-->
            <el-upload
                    class="upload-demo"
                    action="../../cloud-other/review/upload"
                    :on-change="handleChange"
                    :on-remove="handleRemove"
                    :file-list="fileList"
                    :auto-upload="true"
                    :on-success="upyes"
                    :on-error="upno"
                    list-type="picture"
                    :limit="1">
                <i slot="trigger" class="el-icon-plus"></i>
                <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
            </el-upload>

            <!--选项-->
            <el-form-item label="选项" :label-width="'100'" v-if="questionOne.type === '单选题' || questionOne.type === '多选题'">
                <div class="grid3" style="grid-template-columns: auto 20px 50px">
                    <el-input autocomplete="off" style="width: 90%" v-model="items.item1">
                    </el-input>A
                    <el-switch active-color="#13ce66" inactive-color="#999" v-model="select.item1"></el-switch>

                    <el-input autocomplete="off" style="width: 90%" v-model="items.item2">
                    </el-input>B
                    <el-switch active-color="#13ce66" inactive-color="#999" v-model="select.item2"></el-switch>

                    <el-input autocomplete="off" style="width: 90%" v-model="items.item3">
                    </el-input>C
                    <el-switch active-color="#13ce66" inactive-color="#999" v-model="select.item3"></el-switch>

                    <el-input autocomplete="off" style="width: 90%" v-model="items.item4">
                    </el-input>D
                    <el-switch active-color="#13ce66" inactive-color="#999" v-model="select.item4"></el-switch>
                </div>
            </el-form-item>

            <!--            判断题-->
            <el-form-item label="选项" :label-width="'100'" v-else-if="questionOne.type === '判断题'">
                <span>错误<el-switch active-color="#13ce66" inactive-color="#999" v-model="select.item1"></el-switch>正确</span>
            </el-form-item>

            <!--            填空题-->
            <el-form-item label="选项" :label-width="'100'" v-else>
                <input type="text" placeholder="答案;号隔开" v-model="questionOne.items">
            </el-form-item>

            <el-form-item label="解题思路" :label-width="'100'">
                <el-input
                        type="textarea"
                        :rows="2"
                        placeholder="请输入内容"
                        v-model="questionOne.ideas">
                </el-input>
            </el-form-item>

        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click="showEditor = false">取 消</el-button>
            <el-button type="primary" @click="addQuestion">提 交</el-button>
        </div>
    </el-dialog>

    <!--    弹窗-->
    <el-dialog title="题目详情" :visible.sync="qus">
        <!--        题目显示-->
        <div v-if="one.type == '填空题'">
            {{one.content}}
            <br/><br/>
            <img v-if="one.image != null && one.image?.trim() !== ''" class="i1" :src="one.image">
            <br/><br/>
            正确答案：{{formattedCorrectAnswers}}
            <br/><br/>
        </div>
        <div v-if="one.type == '单选题' || one.type == '多选题'">
            {{one.content}}
            <br/><br/>
            <img v-if="one.image != null && one.image?.trim() !== ''" class="i1" :src="one.image">
            <ol type="A">
                <li v-for="a in one.items.split(';')"><input type="checkbox" :checked="a.trim().startsWith('$')" disabled>{{a.replace(/^\$/, '')}}</li>
            </ol>
        </div>
        <div v-if="one.type == '判断题'">
            {{one.content}}
            <br/><br/>
            <img v-if="one.image != null && one.image?.trim() !== ''" class="i1" :src="one.image">
            <ol type="A">
                <li><input type="checkbox" disabled :checked="one.items == 'true'">对</li>
                <li><input type="checkbox" disabled :checked="one.items == 'false'">错</li>
            </ol>
        </div>
        <div v-if="one.type == '问答题'">
            {{one.content}}
            <br/><br/>
            <img v-if="one.image != null && one.image?.trim() !== ''" class="i1" :src="one.image">
        </div>
        <div>
            解析思路：{{one.ideas}}
        </div>
        <div slot="footer" class="dialog-footer">
            <el-button @click="qus = false">取 消</el-button>
        </div>
    </el-dialog>

  <!-- 编辑信息弹框 -->
    <el-dialog title="题目信息" :visible.sync="bj">
        <el-form>
            <el-form-item label="课程" :label-width="'100'">
                <el-select placeholder="请选择课程" v-model="updateQuestion.course">
                    <el-option v-for="t in type" :label="t?.tname" :value="t.tname"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="题目" :label-width="'100'">
                <el-input autocomplete="off" type="textarea" style="width: 90%" v-model="updateQuestion.content"></el-input>
            </el-form-item>

            <!--      图片-->
            <el-upload
                    class="upload-demo"
                    action="../../cloud-other/review/upload"
                    :on-change="handleChange"
                    :file-list="fileList"
                    :on-remove="handleRemove"
                    :auto-upload="true"
                    :on-success="upyes1"
                    :on-error="upno"
                    list-type="picture"
                    :limit="1">
                <i slot="trigger" class="el-icon-plus"></i>
                <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
            </el-upload>

            <!--选项-->
            <el-form-item label="选项" :label-width="'100'" v-if="updateQuestion.type === '单选题' || updateQuestion.type === '多选题'">
                <div class="grid3" style="grid-template-columns: auto 20px 50px">
                    <el-input autocomplete="off" style="width: 90%" v-model="items.item1">
                        <span slot="append">
                            <el-button icon="el-icon-plus"></el-button>
                            <el-button icon="el-icon-minus"></el-button>
                        </span>
                    </el-input>A
                    <el-switch active-color="#13ce66" inactive-color="#999" v-model="select.item1"></el-switch>

                    <el-input autocomplete="off" style="width: 90%" v-model="items.item2">
                        <span slot="append">
                            <el-button icon="el-icon-plus"></el-button>
                            <el-button icon="el-icon-minus"></el-button>
                        </span>
                    </el-input>B
                    <el-switch active-color="#13ce66" inactive-color="#999" v-model="select.item2"></el-switch>

                    <el-input autocomplete="off" style="width: 90%" v-model="items.item3">
                        <span slot="append">
                            <el-button icon="el-icon-plus"></el-button>
                            <el-button icon="el-icon-minus"></el-button>
                        </span>
                    </el-input>C
                    <el-switch active-color="#13ce66" inactive-color="#999" v-model="select.item3"></el-switch>

                    <el-input autocomplete="off" style="width: 90%" v-model="items.item4">
                        <span slot="append">
                            <el-button icon="el-icon-plus"></el-button>
                            <el-button icon="el-icon-minus"></el-button>
                        </span>
                    </el-input>D
                    <el-switch active-color="#13ce66" inactive-color="#999" v-model="select.item4"></el-switch>
                </div>
            </el-form-item>

            <!--            判断题-->
            <el-form-item label="选项" :label-width="'100'" v-else-if="updateQuestion.type === '判断题'">
                <span>错误<el-switch active-color="#13ce66" inactive-color="#999" v-model="select.item1"></el-switch>正确</span>
            </el-form-item>

            <!--            填空题-->
            <el-form-item label="选项" :label-width="'100'" v-else>
                <input type="text" v-model="updateQuestion.items">
            </el-form-item>

            <el-form-item label="解题思路" :label-width="'100'">
                <el-input
                        type="textarea"
                        :rows="2"
                        placeholder="请输入内容"
                        v-model="updateQuestion.ideas">
                </el-input>
            </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click="bj = false">取 消</el-button>
            <el-button type="primary" @click="updateOne">确 定</el-button>
        </div>
    </el-dialog>

</div>

<script src="../../js/vue.js"></script>
<script src="../js/index.js"></script>
<script src="../../js/axios.js"></script>
<script src="../../js/qs.js"></script>

<script>
  let app = new Vue({
    el: '#app',
    data: {
      product: {
    	  pid: '',
    	  pname: '',
          tname: '',
          status:'-1',
          types: '-1'
      },
      members: [],
      //添加商品信息
        questionOne:{type:'', content:'', course:'', items:'', ideas:''},
        items:{item1:"", item2:"", item3:"", item4:""},
        select:{item1:false, item2:false, item3:false, item4:false},
      //修改商品信息
        updateQuestion:{},
        bj:false,
      type:[],
      tname:'',
      picshow:'',
      currentPage4: 1,	//当前所在的页
      searchone:[],		//存取搜索数据
      total:0,			//总数
      pagesize:10,		//每页数量
      restaurants: [],
      a:[],
      allpname:[],
        str:'',
        sum: {},
        showEditor:false,
        fileList: [], // 存储已选择的文件列表
        pic:'',
        qus: false,
        one: {},
    },
    created() {
      this.getType();
    },
    methods: {
      //获取类别
      getType(){
    	  axios.get("../../cloud-other/type/getType").then(resp=>{
          	this.type = resp.data.data;
              this.bygoods(1);
            this.type.forEach(item => {
                item.value = item.tname;
            });
          	this.restaurants = this.type;
          });
      },
      //提示
      querySearch1(queryString, cb) {
          var allpname = this.allpname;
          var results = queryString ? allpname.filter(this.createFilter(queryString)) : allpname;
          // 调用 callback 返回建议列表的数据
          cb(results);
        },
      //返回输入建议的方法，也就是说输入框一获取焦点。就会自动调用该方法拿到数据，这些数据就是输入建议的数据
      querySearch(queryString, cb) {
          var restaurants = this.restaurants;
          var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
          // 调用 callback 返回建议列表的数据
          cb(results);
        },
        createFilter(queryString) {
            return (restaurant) => {
              return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
            };
          },
		//搜索商品
	    bygoods(val){
    	  	//存临时变量
    	  	this.currentPage4 = val;
    	  	this.searchone = this.product;
              let p = new URLSearchParams();
              p.append("currentPage4",this.currentPage4);
              p.append("pagesize",this.pagesize);
              p.append("pid",this.searchone.pid);
              p.append("pname",this.searchone.pname);
              p.append("status",this.searchone.status);
              p.append("types",this.searchone.types);
              if(this.searchone.tname !== ''){
                  p.append("tid",this.type.find(type=> type.tname == this.searchone.tname).id);
              }else{
                  p.append("tid", '');
              }
	    	axios.post("../../cloud-other/question/bygoods", p).then(resp=>{
	    		this.members = resp.data;
	    		this.total = this.members.total;
	    	});
	    },
        open(obj){
            this.qus = true;
            this.one = obj;
        },
	    //编辑
        update(obj){
            this.updateQuestion = JSON.parse(JSON.stringify(obj));
            this.updateQuestion.course = this.type.find(a=> a.id == this.updateQuestion.course)?.tname;
            this.fileList = [];
            if(this.updateQuestion.image !== null && this.updateQuestion.image.trim() !== ''){
                this.fileList[0] = {
                    name: '题目图片',
                    url: this.updateQuestion.image
                };
            }
            //字段验证复原
            this.sum = JSON.parse(JSON.stringify(obj));
            this.bj = true;

            if(this.updateQuestion.type.endsWith("选题")){
                //清空
                this.items = {item1:" ", item2:" ", item3:" ", item4:" "};
                this.select = {item1:false, item2:false, item3:false, item4:false};
                //赋值
                var strings = this.updateQuestion.items.split(";");
                for (let i = 0; i < strings.length; i++) {
                    let key = `item${i + 1}`;
                    if (strings[i].startsWith("$")) {
                        strings[i] = strings[i].substring(1);
                        this.select[key] = true;
                    }
                    this.items[key] = strings[i];
                }
            }else if(this.updateQuestion.type == "判断题"){
                this.select = {item1:false, item2:false, item3:false, item4:false};
                if(this.updateQuestion.items.includes("true")){
                    this.select.item1 = true;
                }
            }
        },
        updateOne(){
            //整和答案
            if(this.updateQuestion.type.endsWith("选题")){
                //选择题答案合计
                let a = "";
                for (let name in this.select) {
                    if(this.select[name]){
                        this.items[name] = "$" + this.items[name];
                    }
                    a += this.items[name] + ";";
                }
                this.updateQuestion.items = a.slice(0, -1);
            }else if(this.updateQuestion.type === "判断题"){
                if(this.select.item1){
                    this.updateQuestion.items = " true";
                }else{
                    this.updateQuestion.items = ";false ";
                }
            }
            //发送请求
            this.updateQuestion.course = this.type.find(a=> a.tname == this.updateQuestion.course)?.id;
            axios.post("../../cloud-other/question/update", this.updateQuestion).then(res=>{
                if(res.data.code == 0){
                    let a = "";
                    res.data.data.forEach(err=>{
                        a += err.defaultMessage;
                    });
                    if(a.includes("单选题")){
                        this.update(this.sum);
                    }
                    this.$alert(a);
                }else {
                    this.bj = false;
                    this.bygoods(this.currentPage4);
                }
            });
        },
		//上架，下架商品
		banL(index, obj){
          let p = new URLSearchParams();
          p.append("id", obj.id);
          p.append("status", obj.status);
			axios.post("../../cloud-other/question/banL", p).then(resp=>{
				if(resp.data.code === 1){
					this.bygoods(this.currentPage4);
					alert("操作成功");
				}else{
					alert("操作失败");
				}
			});
		},
		//每页展示数据条数的调整
		handleSizeChange(val) {
			//变化每页值的数量
			this.pagesize = val;
			this.bygoods(1);
	      },
	      //控制页面的跳转
	    handleCurrentChange(val) {
	    	  this.bygoods(val);
	      },
        formatTimestamp(timestamp) {
            const date = new Date(timestamp);
            const year = date.getFullYear();
            const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始，需要加1
            const day = String(date.getDate()).padStart(2, '0');
            return `${year}-${month}-${day}`;
        },
        //清空答案
        clean(){
            this.items={item1:"", item2:"", item3:"", item4:""},
                this.select={item1:false, item2:false, item3:false, item4:false}
        },
        //上传题库
        upquestion(){
            //将值清空
            this.questionOne = {type:'', content:'', course:'', items:'', image: ''};
            this.items = {item1:"", item2:"", item3:"", item4:""};
            this.select = {item1:false, item2:false, item3:false, item4:false};
            this.fileList = [];
            this.pic = "";
            this.showEditor = true;
        },
        //新增题目
        addQuestion(){
            if(this.fileList.length > 0){
                //有图片
                this.questionOne.image = this.pic;
            }else{
                this.questionOne.image = '';
            }
            if(this.questionOne.type != "填空题"){
                this.questionOne.items = "";
            }
            //整和答案
            if(this.questionOne.type.endsWith("选题")){
                //选择题答案合计
                for (let name in this.select) {
                    if(this.items[name] != "" && this.str == ""){
                        this.items[name] = this.items[name].replace(/^\$/, '');
                    }
                    if(this.select[name]){
                        //选中加$
                        this.items[name] = "$" + this.items[name];
                    }
                    this.questionOne.items += this.items[name] + ";";
                }
                this.questionOne.items = this.questionOne.items.slice(0, -1);
            }else if(this.questionOne.type === "判断题"){
                if(this.select.item1){
                    this.questionOne.items = "true";
                }else{
                    this.questionOne.items = "false";
                }
            }

            axios.post("../../cloud-other/question/addQuestion", this.questionOne).then(res=>{
                if(res.data.code == 0){
                    let a = "";
                    res.data.data.forEach(err=>{
                        a += err.defaultMessage;
                    });
                    this.$alert(a);
                    this.str = a;
                    for (let i = 0; i < Object.keys(this.items).length; i++) {
                        let key = `item${i + 1}`;
                        this.items[key] = this.items[key].replace(/^\$/, '');
                    }
                }else {
                    this.$alert(res.data.msg);
                    this.str = "";
                    this.fileList = [];
                    this.pic = "";
                    this.bygoods(this.currentPage4);
                    this.showEditor = false;
                }
            });
        },
        // 文件上传
        handleChange(file, fileList) {
            // 如果已经选择了文件，则不再允许添加新的文件
            this.fileList = fileList;
            if (this.fileList.length > 1) {
                this.$message.error('只能上传一张图片！');
                // 可以选择移除多余的文件
                this.fileList.splice(1);
            }
            // 如果文件列表中有文件，显示预览
            if (this.fileList.length > 0) {
                this.dialogImageUrl = this.fileList[0].raw ? URL.createObjectURL(this.fileList[0].raw) : this.fileList[0].url;
                this.dialogVisible = true;
            }
        },
        handleRemove(file, fileList) {
            // 移除文件并关闭预览
            this.fileList = fileList.filter(f => f.name !== file.name);
            this.pic = "";
            this.updateQuestion.image = '';
            this.dialogVisible = false;
        },
        //文件上传成功
        upyes(response){
            this.pic = response.data;
        },
        //失败
        upno(err){
            alert("抱歉，请重新上传！");
        },
        upyes1(response){
            this.updateQuestion.image = response.data;
        },
    },
      computed: {
          // 计算属性来格式化正确答案
          formattedCorrectAnswers() {
              if (!this.one.items) return ''; // 如果没有items，则返回空字符串
              const answers = this.one.items.split(';'); // 使用分号分割字符串
              if (answers.length === 1) {
                  // 如果只有一个答案，直接返回
                  return answers[0];
              } else {
                  // 如果有多个答案，将分号替换为、并返回
                  return answers.join('、');
              }
          }
      }
  });
</script>

</body>
</html>